<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<style type="text/css">

</style>

	<%-- 列表区域 --%>
			<div style="float: left;width: 100%;height: 150px;background-color: #EEEEEE;">
				<div style="float: left;width: 100%;height: 30px;line-height: 30px;text-align: left;background-color: #CCCCCC;">
					<span style="font-weight: bold;">我的关注</span><input type="button" value="添加" style="cursor: pointer;margin-left: 10px;background-color: gray;border: none;color: white;">
				</div>
				<div id="indexHotTagListDiv" style="float: left;width: 100%;height: auto;overflow: hidden;">
					
				</div>
			</div>
			<div style="float: left;width: 100%;height: 50px;background-color: #EEEEEE;">
				<input type="button" value="只看标签" style="cursor: pointer;background-color: gray;border: none;margin-top: 5px;color: white;">
				<input type="button" value="查看全部" style="cursor: pointer;background-color: gray;border: none;margin-top: 5px;color: white;">
			</div>
			<div class="margin_10"></div>
			<div style="float: left;width: 100%;height: auto;overflow: hidden;border-bottom: 1px solid gray;background-color: #EEEEEE">
				<div style="float: left;width: 100%;height: 30px;line-height: 30px;text-align: left;background-color: #CCCCCC;">
					<span style="font-weight: bold;">话题分类</span>
				</div>
				<div style="float: left;width: 100%;height: auto;overflow: hidden;">
					<span style="float: left;width: 100%;height: 30px;line-height: 30px;">+读书</span>
					<span style="float: left;width: 100%;height: 30px;line-height: 30px;">+漫画</span>
					<span style="float: left;width: 100%;height: 30px;line-height: 30px;">+电脑</span>
					<span style="float: left;width: 100%;height: 30px;line-height: 30px;">+餐饮</span>
				</div>
			</div>

<%-- Javascript 区域 --%>
<script type="text/javascript">

//
//---------------------------------------- 全局变量 ------------------------------------------------
//
var partTagListMethod_selectArticleImplementation = function() { alert("partTagListMethod_selectArticleImplementation is not registered"); };
var partTagListMethod_registerGetTagArrayString = function() { alert("partTagListMethod_registerGetTagArrayString is not registered"); };

<%
	String methodName_selectArticleImplementation = request.getParameter("methodName_selectArticleImplementation");
	String methodName_registerGetTagArrayString = request.getParameter("methodName_registerGetTagArrayString");
	
	if (methodName_selectArticleImplementation != null) {
%>
		partTagListMethod_selectArticleImplementation = <%= methodName_selectArticleImplementation %>;
<%
	}
	
	if (methodName_registerGetTagArrayString != null) {
%>
		partTagListMethod_registerGetTagArrayString = <%= methodName_registerGetTagArrayString %>;
<%		
	}
%>

//
//---------------------------------------- 自动执行代码 ------------------------------------------------
//

// 注册获取特定标签列表的回调方法
partTagListMethod_registerGetTagArrayString(checkFilterTagList);

//初始化首页TagList
initIndexHotTagList();

//
//---------------------------------------- 对外公开的函数 ------------------------------------------------
//

// 暂无


//
//---------------------------------------- 私有函数 ------------------------------------------------
//
	//添加TagList修改监听
	function addListenerOfTagChange() {
		$("input[type='checkbox'][name='filterTags']").click(function() {
			partTagListMethod_selectArticleImplementation();
		});
	}
	
	//获取当前选择的标签
	function checkFilterTagList() {
		// 空字符串表示选择系统全部标签，即不把标签作为过滤条件
		var tagArrStr = '';
		$("input[type='checkbox'][name='filterTags']:checked").each(function(){  
			tagArrStr += $(this).val();
			tagArrStr += "-";
		});

		return tagArrStr;
	}
	
	
	//初始化首页过滤TagList
	function initIndexHotTagList() {
		$.ajax({
			url: 'ajaxQueryHotTagList.action',
			data: null,
			type: 'post',
			async: true,
			dataType: 'json',
			success: function(res) {
				var rs = res.result;
				var tagListContent = '';
				if(rs == 0) {
					for(var i=0;i<res.data.length;i++) {
						var item = res.data[i];
						tagListContent += 
							'<input name="filterTags" type="checkbox" checked="checked" value="'+item.tagId+'">'+item.tagName+'<br>';
					}
					$('#indexHotTagListDiv').html(tagListContent);
				}
				//添加TagList监听
				addListenerOfTagChange();
			}
		});
	}
</script>